<template>
  <div class="page">
    <div class="page-title">
      <div class="page-title-left">
        <span>平台处罚积分</span>
        <span>({{totalintegral}})</span>
      </div>
      <div class="page-title-right">
        <!-- <div class="export-btn" @click="exportData">
          <img src="../../../assets/img/export.png" alt>
          <span>导出</span>
        </div> -->
        <export-btn :form="form" :url="url"></export-btn>
      </div>
    </div>
    <div class="page-main">
      <el-form ref="form" :model="form" label-width="85px">
        <el-row>
          <el-col :span="10">
            <el-form-item label="处罚时间段">
              <el-date-picker v-model="form.startdate" type="date" placeholder="选择日期" value-format="yyyy-MM-dd" style="width: 140px;"></el-date-picker>~
              <el-date-picker v-model="form.enddate" type="date" placeholder="选择日期" value-format="yyyy-MM-dd" style="width: 140px;"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="14">
            <el-form-item label="姓名">
              <el-input v-model="form.nickname" placeholder="请输入姓名" style="width: 200px;" clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10">
            <el-form-item label="处罚类型">
              <el-select v-model="form.punishtype" placeholder="请选择" clearable>
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="所在地区">
              <city-Cascader :citys="form.citys" :level="level" :notRequire="true" @handleChange="handleCityChange" style="width: 190px;"></city-Cascader>
            </el-form-item>
          </el-col>
          <el-col :span="7" style="text-align: right;">
            <el-button type="primary" style="width: 120px;" @click="query">查询</el-button>
          </el-col>
        </el-row>
      </el-form>
      <div v-loading="loading">
        <el-table :data="tableData" stripe style="margin-bottom: 22px;" size="small" border>
          <el-table-column  prop="nickname" label="会员名称" align="center"></el-table-column>
          <el-table-column  prop="companyname" label="应聘公司" align="center"></el-table-column>
          <el-table-column  prop="positionname" label="应聘岗位" align="center"></el-table-column>
          <el-table-column  prop="region" label="所在地区" align="center"></el-table-column>
          <el-table-column  label="处罚类型" align="center">
            <template slot-scope="scope">
              <span v-if="scope.row.punishtype === '1'">异常离职</span>
              <span v-else-if="scope.row.punishtype === '2'">面试爽约</span>
              <span v-else-if="scope.row.punishtype === '3'">复试异常</span>
              <span v-else-if="scope.row.punishtype === '4'">录取异常</span>
              <span v-else-if="scope.row.punishtype === '5'">入职异常</span>
            </template>
          </el-table-column>
          <el-table-column  prop="interalnum" label="处罚积分" align="center"></el-table-column>
          <el-table-column  prop="auditdate" label="处罚时间" align="center"></el-table-column>
          <el-table-column  prop="auditorname" label="操作人" align="center"></el-table-column>
          <el-table-column  label="操作" align="center">
            <template slot-scope="scope">
              <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="form.pagenum" :page-sizes="[10, 20, 30, 50, 100]" :page-size="form.pagesize" layout="total, sizes, prev, pager, next, jumper" :total="total" background></el-pagination>
      </div>
    </div>
    <el-dialog :visible.sync="dialogVisible" width="600px">
      <div class="dialog-title">
        <div class="dialog-title-left">
          <span>查看</span>
        </div>
      </div>
      <div class="dialog-main">
        <el-row>
          <el-col :span="12">
            <span>会员名称：</span>
            <span>{{detail.nickname}}</span>
          </el-col>
          <el-col :span="12">
            <span>性别：</span>
            <span v-if="detail.sex === '0'">未填</span>
            <span v-else-if="detail.sex === '1'">男</span>
            <span v-else>女</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <span>应聘公司：</span>
            <span>{{detail.companyname}}</span>
          </el-col>
          <el-col :span="12">
            <span>应聘岗位：</span>
            <span>{{detail.positionname}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <span>所在地区：</span>
            <span>{{detail.region}}</span>
          </el-col>
          <el-col :span="12">
            <span>处罚积分：</span>
            <span>{{detail.interalnum}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <span>处罚时间：</span>
            <span>{{detail.auditdate}}</span>
          </el-col>
          <el-col :span="12">
            <span>操作人：</span>
            <span>{{detail.auditorname}}</span>
          </el-col>
        </el-row>
        <el-row style="display: flex;">
          <span style="min-width: 80px;">处罚原因：</span>
          <span>{{detail.note}}</span>
          <!-- <el-col :span="4">处罚原因：</el-col>
          <el-col :span="20">{{detail.note}}</el-col>-->
        </el-row>
      </div>
    </el-dialog>
  </div>
</template>

<script src="./index.js">
</script>

<style scoped src="./index.css">
</style>
